<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>协同任务-列表页</title>
    <link rel="stylesheet" th:href="@{/resources/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/resources/plugins/bootstrap-table/bootstrap-table.min.css}">
    <link rel="stylesheet" th:href="@{/resources/awi/css/font-awesome.css}">
    <!-- Theme style -->
    <link rel="stylesheet" th:href="@{/resources/awi/css/AdminLTE.min.css}">
    <link rel="stylesheet" th:href="@{/resources/awi/css/skins/all-skins.min.css}">
</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="page-header">
                <h3>主页
                    <small>协同任务</small>
                </h3>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="box box-solid box-info">
                <div class="box-header">查询</div>
                <div class="box-body">
                    <form id="search-form" class="form-inline">
                        <div class="col-md-3 form-group">
                            <label>参数</label>
                            <input type="text" class="form-control params" name="" id="">
                        </div>
                        <div class="col-md-3">
                            <div class="btn-group">
                                <button type="button" class="btn btn-success" onclick="tableDataRefresh('#coordTask-data-table')"><i class="fa fa-search"></i>查询</button>
                                <button type="reset" class="btn btn-warning"><i class="fa fa-refresh"></i> 重置</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <div class="row" id="toolbar">
        <div class="col-md-12">
            <div class="btn-group btn-group-xs">
                <button type="button" class="btn btn-info" onclick="createNew('coordTask')"><i class="fa fa-plus"></i>新增</button>
                <button type="button" class="btn btn-danger" onclick="batchRemove()"><i class="fa fa-remove"></i>删除</button>
                <button type="button" class="btn btn-success" onclick="tableDataRefresh('#coordTask-data-table')"><i class="fa fa-refresh"></i>刷新</button>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12 table-responsive">
            <table id="coordTask-data-table"
                   data-locale="zh-CN" data-pagination="true" data-response-handler="dataTableResponseHandler"
                   data-unique-id="uid" data-id-field="id" data-side-pagination="server" data-classes="table table-hover table-no-bordered"
                   data-toolbar="toolbar"  	data-query-params-type="limit" data-height="730" data-striped="true" data-click-to-select="true"
                   data-query-params="dataTableQueryParams" data-method="post" data-content-type="application/x-www-form-urlencoded"
            >
                <thead>
                <tr>
                    <th data-title="多选" data-field="ck" data-align="center" data-valign="middle" data-checkbox=true></th>
                    <th data-title="优先级" data-field="priority" data-align="center" data-valign="middle" data-width="20"></th>
                    <th data-title="关联事项" data-field="title" data-align="center" data-valign="middle" data-width="250"  data-formatter="showOnMouseHover"  	data-cell-style="dataOverflowHidden"></th>
                    <th data-title="任务标题" data-field="name" data-align="center" data-valign="middle" data-width="350" data-formatter="showOnMouseHover"  	data-cell-style="dataOverflowHidden"></th>
                    <th data-title="任务委派人" data-field="assignee" data-align="center" data-valign="middle" data-width="80"></th>
                    <th data-title="进度(%)" data-field="progress" data-align="center" data-valign="middle" data-width="80"></th>
                    <th data-title="办理状态" data-field="taskStatus" data-align="center" data-valign="middle" data-width="80" data-formatter="taskStatusFormatter"></th>
                    <th data-title="创建时间" data-field="createTime" data-align="center" data-valign="middle" data-width="150" data-formatter="timeFormatter"></th>
                    <th data-title="更新时间" data-field="updateTime" data-align="center" data-valign="middle" data-width="150"></th>
                    <th data-title="操作" data-field="uid" data-align="center" data-valign="middle" data-width="150"
                        data-formatter="opFormatter"></th>
                </tr>
                </thead>

            </table>
        </div>
    </div>
</div>
</body>
<script th:src="@{/resources/plugins/jQuery/jquery-2.2.3.min.js}"></script>
<!-- Bootstrap 3.3.6 -->
<script th:src="@{/resources/bootstrap/js/bootstrap.min.js}"></script>

<!-- Bootstrap 3.3.6 -->
<script th:src="@{/resources/plugins/bootstrap-table/bootstrap-table.min.js}"></script>
<script th:src="@{/resources/plugins/bootstrap-table/bootstrap-table-locale-all.min.js}"></script>
<script th:src="@{/resources/layer/layer.js}"></script>
<script th:src="@{/resources/plugins/plugins-init/plugins-init.js}"></script>
<script th:src="@{/resources/commons/js/prototype.js}"></script>
<script type="text/javascript">
    //新增创建
    function createNew(){
        layer.open({
            title: '协同任务新增',
            type: 2,
            content: '/coordTask/toCreateView',
            area: ['800px', '600px'],
            maxmin: true,
            end:function () {
                tableDataRefresh('#coordTask-data-table');
            }
        });
    }
    //信息编辑
    function edit(uid){
        layer.open({
            title: '协同任务编辑',
            type: 2,
            content: '/coordTask/toEditView?uid='+uid,
            area: ['800px', '600px'],
            maxmin: true,
            end:function () {
                tableDataRefresh('#coordTask-data-table');
            }
        });
    }
    function showDetail(uid){
        var detailView = layer.open({
            title: '任务详情',
            type: 2,
            content: '/coordTask/toTaskDetailView?uid='+uid,
            area: ['800px', '600px'],
            maxmin: true,
            end:function () {
                tableDataRefresh('#coordTask-data-table');
            }
        });
        layer.full(detailView);
    }

    //删除
    function remove(uid){
        $.get("/coordTask/remove?uid="+uid,function(data){
            $("#coordTask-data-table").bootstrapTable('refresh');
        })
    }
    //批量删除
    function batchRemove (){
        var selectedRows = $("#coordTask-data-table").bootstrapTable('getAllSelections');
        var uids=[];
        $.each(selectedRows,function(index,value){
            uids.push(value.uid);
        })
        $.post("/coordTask/batchRemove",{"uids":uids},function(data){
            $("#coordTask-data-table").bootstrapTable('refresh');
        })
    }


    function opFormatter(value, row, index) {
        var detailItem = '<li><a href="javascript:showDetail(\''+row.uid+'\')"><i class="fa fa-info-circle"></i>详情</a></li>';
        var startItem = '<li><a href="javascript:remove(\''+row.uid+'\')"><i class="fa fa-play-circle"></i>开始</a></li>';
        var reportItem = '<li><a href="javascript:remove(\''+row.uid+'\')"><i class="fa fa-reply"></i>进度更新</a></li>';
        var completeItem = '<li><a href="javascript:edit(\''+row.uid+'\')" ><i class="fa fa-compass"></i>完成</a></li>';
        var suspensionItem = '<li><a href="javascript:edit(\''+row.uid+'\')" ><i class="fa fa-stop-circle"></i>中止</a></li>';
        return '<div class="btn-group btn-group-xs">' +
            '<button type="button" class="btn btn-primary dropdown-toggle"  data-toggle="dropdown"><i class="fa fa-hand-pointer-o"></i>&nbsp;操作<span class="caret"></span></button>' +
            '<ul class="dropdown-menu" role="menu">'
            +detailItem+startItem+ reportItem + completeItem +suspensionItem+
            '</ul>' +
            '</div>';

    }
    $(function(){
        $("#coordTask-data-table").bootstrapTable({
            url:'/coordTask/getTaskToDoPagingData'
        });
    });
    function taskStatusFormatter(value,row,index){
        var taskStatus="";
        if("待确认"==value){
            return '<span class="label label-default">'+value+'</span>';
        }else if("进行中"==value){
            return '<span class="label label-info">'+value+'</span>';
        }else if("进行中"==value){
            return '<span class="label label-primary">'+value+'</span>';
        }else if("已完成"==value){
            return '<span class="label label-success">'+value+'</span>';
        }else if("已中止"==value){
            return '<span class="label label-danger">'+value+'</span>';
        }else if("已暂停"==value){
            return '<span class="label label-warning">'+value+'</span>';
        }

    }



</script>
</html>
<!--
/**
 * @ClassName 新增-协同任务
 * @Description TODO
 * @Company 会飞的锅工作室
 * @Author yuelh
 * @Email 527083487@qq.com
 * @Date 2020/05/07 10:02:20
 * @Version 1.0
-->